<template>
  <div class="three">
    <dv-scroll-board
      v-if="isShow"
      :config="config"
      style="width: 100%; height: 100%"
      class="table_arr"
    />
  </div>
</template>

<script setup>
import { onMounted, ref } from "vue";
import { selectDayMenu } from "@/api/progress";
import * as echarts from "echarts";
const isShow = ref(false);
const config = ref({
  header: ["菜谱名称", "类型"],
  data: [
    // ['伊庄实小卫星厨房', '是'],
    // ['棠张小学卫星厨房', '是'],
    // ['大彭小学卫星厨房', '是'],
    // ['科技谷卫星厨房', '是'],
    // ['大学路北校区卫星厨房', '是'],
    // ['汉王镇刘庄小学卫星厨房', '是'],
    // ['利国镇磊庄卫星厨房', '是'],
    // ['大许河西卫星厨房', '是'],
    // ['茅村镇任庄卫星厨房', '是'],
    // ['何桥镇金寨路卫星厨房', '是'],
    // ['三堡实验小学卫星厨房', '是'],
    // ['新区实验小学卫星厨房', '是'],
    // ['马坡王堂幼儿园卫星厨房', '是'],
  ],
});

// 更新数据
function updateData(data) {
  // console.log('updateData', data)
  config.value.data = [];
  isShow.value = false;
  selectDayMenu({
    week: data.week,
  }).then((res) => {
    if (res.code == 200) {
      config.value.data = res.data.map((item) => {
        return [item.menuName, item.time];
      });
      isShow.value = true;
    }
  });
  // config.value.data = data.map(item => {
  //   return [item.title, item.type]
  // })
  //   config.value.data = data
}

defineExpose({
  updateData,
});
</script>

<style lang='scss' scoped>
.table_arr {
  width: 100%;
  height: 100%;
}
.three {
  width: 95%;
  height: 90%;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
}

.chart-wrapper {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  height: 100%;
}

.chart-container {
  width: 100%;
  height: 100%;
}
</style>
